function BodyOnLoad() {
	var MapConfig = {	
		zoomBox:		document.getElementById("respokaneZoomBox"), // 
		mapBox:			document.getElementById("respokaneGoogleMap"),
		mapBoxWrapper:	document.getElementById("respokaneSearchMap"), 
		BoxLineColor:	"#CC0202",
		BoxLineWidth:	2,
		BoxLineTrans:	.65,
		lat1: 47.85187391101592,
		long1: -117.1142578125,
		lat2: 47.481016589036074,
		long2: -117.66357421875,
	} 
	MapObj.initialize(MapConfig);
}

var MapObj = {
	// config BEGIN
	zoomBox:null, // 
	mapBox:null,
	mapBoxWrapper:null,// parent div of the gmap div, used for assign event listener when drag search map, shouldnot use gmap div caused of z-index problem
	BoxLineColor:null,
	BoxLineWidth:null,
	BoxLineTrans:null,
	lat1:null,
	long1:null,
	lat2:null,
	long2:null,
	// config END
	
	PolyOutline:null,
	GOOGLEMAPO:null, // GMap2 object
	MapMode:{
		dragMode:0,
		selectMode:1
	},
	
	// vars used in drag search
	originX:0, // origin mouse X position in page when mousedown
	originY:0, // origin mouse Y position in page  when mousedown
	originLeft:0, // origin mouse left position when mousedown: from cursor to mapwraper div
	originTop:0,// origin mouse top position when mousedown: from cursor to mapwraper div
	newLeft:0, // new mouse left position when mousemove: from cursor to mapwraper div
	newTop:0,// new mouse top position when mousemove: from cursor to mapwraper div
	newWidth:0,// when mousemove: new width of mapwrapper div
	newHeight:0,// when mousemove: new height of mapwrapper div
	_initCenter:null, // var used for reset map screen 
	_initZoom:null,// var used for reset map screen 
	initialize: function(mapConfig) {
      	if (GBrowserIsCompatible()) {
      		// init config BEBIN
      		this.zoomBox = mapConfig.zoomBox; 
			this.mapBox = mapConfig.mapBox;
			this.mapBoxWrapper = mapConfig.mapBoxWrapper;
			this.BoxLineColor = mapConfig.BoxLineColor;
			this.BoxLineWidth = mapConfig.BoxLineWidth;
			this.BoxLineTrans = mapConfig.BoxLineTrans;
			this.lat1 = mapConfig.lat1;
			this.long1 = mapConfig.long1;
			this.lat2 = mapConfig.lat2;
			this.long2 = mapConfig.long2;
      		// init config END
	        this.GOOGLEMAPO = new GMap2(this.mapBox);
	        
	        //get the bounds and zoom in
			var rsBounds = new GLatLngBounds(new GLatLng(this.lat2, this.long2),
											 new GLatLng(this.lat1, this.long1));	
			
			_initCenter = rsBounds.getCenter();
			_initZoom = this.GOOGLEMAPO.getBoundsZoomLevel(rsBounds);
			//build map and center
			this.GOOGLEMAPO.setCenter(_initCenter, _initZoom);
	        //add controls
			this.GOOGLEMAPO.addControl(new GLargeMapControl());
			this.GOOGLEMAPO.addControl(new GScaleControl());
			
			this.GOOGLEMAPO.enableDoubleClickZoom();
			this.GOOGLEMAPO.enableDragging();
			// change mode
			this.changeMode(this.MapMode.selectMode);
		}
    },
    
    // change mode
    changeMode: function(mode){
    	
    },
    CenterMap: function()
	{
		//document.getElementById("message").value += '\n center=lat:' + arguments[0].getCenter().lat() +",lng:" + arguments[0].getCenter().lng() + "  boundszoomlevel:" +  this.GOOGLEMAPO.getBoundsZoomLevel(arguments[0]);
		this.GOOGLEMAPO.setCenter(arguments[0].getCenter(), this.GOOGLEMAPO.getBoundsZoomLevel(arguments[0])); 			
	},
	BoxCorners: function(points)
	{
		var boxPoints = new Array();
		//pass box on corners above
		boxPoints[0] = new GLatLng(points[0].y, points[1].x);
		boxPoints[1] = points[0];
		boxPoints[2] = new GLatLng(points[1].y, points[0].x);
		boxPoints[3] = points[1];
		boxPoints[4] = new GLatLng(points[0].y, points[1].x);
		return boxPoints;
	},
	
    selectMode: function(){
    	this.GOOGLEMAPO.disableDragging();
    	this.mapBoxWrapper.addEventListener('mousedown', MapObj.MouseDownH, true);  	 
    	this.mapBoxWrapper.addEventListener('mouseup', MapObj.MouseUpH, true); 	
    },
   	
   	dragMode: function(){
   		this.GOOGLEMAPO.enableDragging();
    	this.mapBoxWrapper.removeEventListener('mousedown', MapObj.MouseDownH, true);  	 
    	this.mapBoxWrapper.removeEventListener('mouseup', MapObj.MouseUpH, true); 	
    	MapObj.mapBoxWrapper.style.cursor = "pointer";
   	},
   	
    MouseUpH: function (e){
    	
    	MapObj.mapBoxWrapper.removeEventListener('mousemove', MapObj.MouseMoveH, true);
    	//document.getElementById('message').value += 'mouseup\n';
    	
    	MapObj.zoomBox.style.width = 0;
		MapObj.zoomBox.style.height = 0;
		MapObj.zoomBox.style.display="none";
		
		//document.getElementById('message').value += "\n N:" +MapObj.newTop + ",E:"+ (MapObj.newLeft+MapObj.newWidth) + ",S:" + (MapObj.newTop+MapObj.newHeight)+",W:" + MapObj.newLeft;
		//set the zoom map bounds to find the center - put this in the zoom box class		
		var neCrn = MapObj.GOOGLEMAPO.fromContainerPixelToLatLng(new GPoint(MapObj.newLeft+MapObj.newWidth,MapObj.newTop));
		var swCrn = MapObj.GOOGLEMAPO.fromContainerPixelToLatLng(new GPoint(MapObj.newLeft,MapObj.newTop+MapObj.newHeight));
		//document.getElementById('message').value += "\n " +neCrn + ","+ swCrn + " "+ neCrn.latRadians()+":"+neCrn.lngRadians()+":"+swCrn.latRadians()+":"+swCrn.lngRadians();
		var rsBounds = new GLatLngBounds(swCrn, neCrn);
		//document.getElementById('message').value += "\n rsBounds: "+ rsBounds + " ";
		MapObj.CenterMap(rsBounds);
				
		//now we draw the box
		//update our poly points
		var tempPoints = new Array();
		tempPoints[0] = neCrn;
		tempPoints[1] = swCrn;
		MapObj.PolyOutline = new GPolyline(MapObj.BoxCorners(tempPoints), MapObj.BoxLineColor, MapObj.BoxLineWidth, MapObj.BoxLineTrans);
		MapObj.GOOGLEMAPO.addOverlay(MapObj.PolyOutline);
		
		//set cursor to default
		MapObj.mapBoxWrapper.style.cursor = "default";
    	
    },
    
    MouseDownH: function(e)
	{
		//document.getElementById("message").value += "mouse down\n";
		
		MapObj.mapBoxWrapper.addEventListener('mousemove', MapObj.MouseMoveH, true);
		
		//clear map overlays
		MapObj.GOOGLEMAPO.clearOverlays();
		
		if (!e) 
			e = window.event;
		//get mouse location
		var MOUSELOCATION_X;
		var MOUSELOCATION_Y;
		if (e.pageX || e.pageY) 	
		{
			MOUSELOCATION_X = e.pageX;
			MOUSELOCATION_Y = e.pageY;
		}
		else if (e.clientX || e.clientY) 	
		{
			MOUSELOCATION_X = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
			MOUSELOCATION_Y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
		}
		//document.getElementById("message").value = "mouse down: " + MOUSELOCATION_X + "," + MOUSELOCATION_Y + "\n";
		//set zoom box position
		var RESPOKANEMPixelOffset = MapObj.respokaneGloGetObjectOffset(MapObj.mapBox);
		MapObj.zoomBox.style.left = (MOUSELOCATION_X -  RESPOKANEMPixelOffset.x) + "px";
		MapObj.zoomBox.style.top = (MOUSELOCATION_Y  -  RESPOKANEMPixelOffset.y) + "px";
		MapObj.zoomBox.style.width = 0;
		MapObj.zoomBox.style.height = 0;
		MapObj.originX = MOUSELOCATION_X;
		MapObj.originY = MOUSELOCATION_Y;
		MapObj.originLeft = MOUSELOCATION_X -  RESPOKANEMPixelOffset.x;
		MapObj.originTop = MOUSELOCATION_Y  -  RESPOKANEMPixelOffset.y;
		MapObj.newLeft= MapObj.originLeft;
		MapObj.newTop = MapObj.originTop;
		//set cursor to crosshair
		MapObj.mapBoxWrapper.style.cursor = "crosshair";
		MapObj.zoomBox.style.display="block";
	},
	
	MouseMoveH: function(e)
	{	
		//document.getElementById("message").value += "mouse move\n";
	
		//capture current mouse event
		if (!e) 
			e = window.event;
		
		//get mouse location
		var MOUSELOCATION_X;
		var MOUSELOCATION_Y;
		if (e.pageX || e.pageY) 	
		{
			MOUSELOCATION_X = e.pageX;
			MOUSELOCATION_Y = e.pageY;
		}
		else if (e.clientX || e.clientY) 	
		{
			MOUSELOCATION_X = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
			MOUSELOCATION_Y = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
		}
		var RESPOKANEMPixelOffset = MapObj.respokaneGloGetObjectOffset(MapObj.mapBox);
		MapObj.newWidth = Math.abs(MOUSELOCATION_X - MapObj.originX);
		MapObj.newHeight = Math.abs(MOUSELOCATION_Y - MapObj.originY);
		MapObj.zoomBox.style.width =  MapObj.newWidth + "px";
		MapObj.zoomBox.style.height = MapObj.newHeight + "px";
		
			
	
		if(MOUSELOCATION_X < MapObj.originX){
			MapObj.newLeft = MapObj.originLeft - MapObj.newWidth;
			MapObj.zoomBox.style.left =  MapObj.newLeft + "px";
		}
		if(MOUSELOCATION_Y < MapObj.originY){	
			MapObj.newTop = MapObj.originTop - MapObj.newHeight;
			MapObj.zoomBox.style.top =  MapObj.newTop + "px";
		}
		//document.getElementById('message').value += "\n N:" +MapObj.newTop + ",E:"+ (MapObj.newLeft+MapObj.newWidth) + ",S:" + (MapObj.newTop+MapObj.newHeight)+",W:" + MapObj.newLeft;
		
	},
	
	resetSearch: function()
	{
		//clear map overlays
		MapObj.GOOGLEMAPO.clearOverlays();
		//then recenter and zoom map
		MapObj.GOOGLEMAPO.setCenter(_initCenter, _initZoom);
		//this.ResetAllToolsNoReCenter();
	},
	
	removeSearchBox:function(){
		//clear map overlays
		MapObj.GOOGLEMAPO.clearOverlays();
	},
	
	changeMapType: function(sList)
	{
		var selectedType = sList.value;//2:G_HYBRID_MAP, 1:G_SATELLITE_MAP, 0: G_NORMAL_MAP
		switch(selectedType)
		{
			case "2":
				MapObj.GOOGLEMAPO.setMapType(G_HYBRID_MAP);
				break;
			case "1":
				MapObj.GOOGLEMAPO.setMapType(G_SATELLITE_MAP);
				break;
			default:
				MapObj.GOOGLEMAPO.setMapType(G_NORMAL_MAP);
				break;
		}
	},
	//respokaneGloGetObjectOffset :: returns the offset for a select object in GPoint format (x,y)
	respokaneGloGetObjectOffset: function (refobj) 
	{
		//figure out y
		var y = refobj.offsetTop;
		var obj = refobj.offsetParent;
		while (obj != null) 
		{
			y += obj.offsetTop;
			obj = obj.offsetParent;
		}
		//figure out x
		var x = refobj.offsetLeft;
		var obj = refobj.offsetParent;
		while (obj != null) 
		{
			x += obj.offsetLeft;
			obj = obj.offsetParent;
		}
		//return g point
		return new GPoint(x,y);
	}

};

